import { List } from "./list.js";

function createVisual(item) {
    var element;

    if (item instanceof List) {
        element = document.createElement("table");
        element.className = "turbosnap-list-container";

        var index = 1;

        console.log(item);
        for (let v of item) {
            console.log(v);
            let row = document.createElement("tr");
            row.className = "turbosnap-list-row";
            element.appendChild(row);

            let indexEl = document.createElement("td");
            indexEl.className = "turbosnap-list-index";
            indexEl.innerHTML = (index++).toString();
            row.appendChild(indexEl);

            let itemEl = document.createElement("td");
            itemEl.className = "turbosnap-list-item";
            itemEl.appendChild(createVisual(v));
            row.appendChild(itemEl);
        }
    } else {
      element = document.createElement("span");
      element.className = "turbosnap-watcher-text";
      element.appendChild(document.createTextNode(item.toString()));
    }

    return element;
}

export { createVisual }; 